﻿<!DOCTYPE html>
<html>
<head>
    <style>
        html {
            height: 100%;
            width: 100%;
        }

        body {
            background: #fff;
            color: #333;
            font-family: Arial, Tahoma, sans-serif;
            font-size: 12px;
            font-weight: normal;
            height: 100%;
            margin: 0;
            overflow-y: hidden;
            padding: 0;
            text-decoration: none;
        }

        .form {
            height: 90%;
        }

        div {
            margin: 0;
            padding: 0;
        }
    </style>
</head>
<script type="text/javascript" th:src="${doc_api}"></script>

<script type="text/javascript" language="javascript" th:inline="javascript">
    //<![CDATA[
    var docEditor;
    var fileName = [[${filename}]];
    var fileType = [[${fileType}]];

    var innerAlert = function (message) {
        if (console && console.log)
            console.log(message);
    };

    var onReady = function () {
        innerAlert("Document editor ready");
    };

    var onDocumentStateChange = function (event) {
        var title = document.title.replace(/\*$/g, "");
        document.title = title + (event.data ? "*" : "");
    };

    var onRequestEditRights = function () {
        location.href = location.href.replace(RegExp("action=view\&?", "i"), "");
    };

    var onError = function (event) {
        if (event)
            innerAlert(event.data);
    };

    var onOutdatedVersion = function (event) {
        location.reload(true);
    };

    var сonnectEditor = function () {

        docEditor = new DocsAPI.DocEditor("iframeEditor",
            {
                width: "100%",
                height: "100%",
                type: "desktop",
                documentType: [[${documentType}]],
                document: {
                    title: fileName,
                    url: [[${url}]],
                    fileType: fileType,
                    key: [[${key}]],
                    permissions: {
                        edit: false,
                        download: false
                    }
                },
                editorConfig: {
                    mode: "view",

                    lang: "zh"
                },
                events: {
                    "onReady": onReady,
                    "onDocumentStateChange": onDocumentStateChange,
                    'onRequestEditRights': onRequestEditRights,
                    "onError": onError,
                    "onOutdatedVersion": onOutdatedVersion,
                }
            });
    };

    if (window.addEventListener) {
        window.addEventListener("load", сonnectEditor);
    } else if (window.attachEvent) {
        window.attachEvent("load", сonnectEditor);
    }

    function getXmlHttp() {
        var xmlhttp;
        try {
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (ex) {
                xmlhttp = false;
            }
        }
        if (!xmlhttp && typeof XMLHttpRequest !== "undefined") {
            xmlhttp = new XMLHttpRequest();
        }
        return xmlhttp;
    }

    //]]>
</script>
<body>
<div class="form">
    <div id="iframeEditor"></div>
</div>
</body>
</html>
